<template>
	<view class="u-page main">
		<list-game :games="games"></list-game>
	</view>
</template>

<script>
import ListGame from "@/components/list-game.vue";

export default {
	components: {
		ListGame,
	},
	data() {
		return {
			games: [],
			loading: false,
		}
	},
	watch: {

	},
	methods: {
		setNavbar(navbar) {
			if (navbar.title) {
				uni.setNavigationBarTitle({
					title: navbar.title,
				})
			}
			if (navbar.background) {
				uni.setNavigationBarColor({
					backgroundColor: navbar.background,
					frontColor: navbar.color,
				})
			}
		},
		getGames() {
			uni.showLoading({
				title: '加载中'
			});
			this.$store.dispatch("app/GetGameListHot").then(({data}) => {
				this.games = data;
			}).finally(() => {
				uni.hideLoading();
			});
		},
		initData() {
			this.getGames();
		},
	},
	// onPullDownRefresh() {
	// 	this.initData();
	// },
	// onPageScroll(e) {
	// 	this.scrollTop = e.scrollTop;
	// 	console.log("onPageScroll", this.scrollTop)
	// },
	created() {
		this.initData();
	}
}
</script>

<style lang="scss" scoped>
	.container {
		// padding-top: 10px;
		// background: white;
		// padding: 10px;
		// box-shadow: 0 0 10px #9a9999;
		// font-size: 14px;
		// line-height: 24px;
		.banner {
			box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.3);
		}
	}
	.main {
		width: calc(100vw - 20px);
		padding: 10px; 
		overflow-x: hidden;
	}
</style>
